| My Role | Timeline | Team Size | Techniques |
|---|---|---|---|
| UI Designer, Developer | 3-4 Weeks | 4 People | HTML, React.JS, CSS, Graphics, Google Analytics |
Description
This project is a mini mobile web riddle game I created for Chinese Valentine's day - QIXI. I get inspired by the Chinese fairytale of NiuLang, who traveled to the celestial palace to meet his lover Zhinv.
This is a 100% original piece by me and three other friends(an illustrator, two riddle writers). We did not copy or use any other code, riddle or illustration.
The project started as a fun side project with my friends, later it got recognized by Hankejiu(a major alcohol vendor in China), and the company requested me to use the the same idea and adopted the codebase for their QIXI campaign mini-website.
Highlights
- Attracted 5000 users on the Chinese valentine's day without any paid advertising on personal social media
- Attracted 1 commercial sponsor for further collaboration
- Had average user session of more than 5 minutes
Concept
Surrounded by social media, now a days young people tend to read much less classics and forget how to correctly write Chinese characters. In order to help people recall the traditions and spread the knowledge of classic literature. I decided to develop a mini web app for the QIXI festival- the traditional Chinese valentine's day.
I initialized this idea of helping the couple Niulang and Zhinv to meet and travel with Niulang from the ground up to the sky while answering ancient poetry style chinese riddles and enjoy the beautiful view. Then, I invited 2 writers and 1 artist to the project.
UI Customization Challenges
- Deal with Chinese poetry layout
- Adjust the UI for both Android and IOS
- Dealing with Android background offset issues with Keyboard
- Deal with scrolling up issues
Design Inspirations
- Fairytale
- Traditionally Chinese Art
What Could be Done Better
- Start with Android Device and work with IOS later. The former is more likely to cause issues
- Use the CANVAS component for images to have absolute control of the background images to avoid Keyboard problems